<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>部署本地插件</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link href="../../res/layui/css/layui.css" rel="stylesheet">
  <link href="../../res/adminui/dist/css/admin.css" rel="stylesheet">
  <script src="../../res/jquery-3.6.0.min.js"></script>
  <script src="../../res/layui/layui.js"></script> 

</head>

<style>
.custom-quote {
    vertical-align: top; /* 垂直对齐方式设为顶部对齐 */
}

.custom-fieldset {
    width: 700px; /* 设置fieldset的宽度 */
    background-color: #eeeeee; /* 设置背景色 */
	border: 1px solid #16baaa; /* 设置边框 */
}
.custom-legend {
    color: 16baaa; /* 设置标题字体颜色 */
    font-size: 20px; /* 设置标题字体大小 */
    font-weight: bold; /* 设置标题字体粗细 */

}
.button-container {
    text-align: center; /* 设置按钮容器的文本对齐方式为右对齐 */

}
.submit-button {
    width: 300px; /* 设置提交按钮的宽度 */
}


body {
    background-color: #2f363c; /* 设置背景色 */
}
</style>
<body class="layui-padding-3">
<div style="padding: 32px;">
<div class="layui-fluid">
	<div class="layui-row layui-col-space15">
		<div class="layui-container">
			<form class="layui-form" action="">
				<div class="layui-row">
					<div class="layui-col-md-offset2 layui-col-md-6">


						<fieldset class="layui-elem-field custom-fieldset">
						<blockquote class="layui-elem-quote custom-legend">
							注册我开发的插件
						</blockquote>
							
						<div class="layui-panel layui-border-green" style="width: 80%; margin: 10px auto;">
						  <div style="padding: 16px;">
							从这里开始您的创造！<br>
							请遵循国家法律法规，不得启用非法插件！不得盗用他人插件！<br>
							技术栈：layui框架+Python+SQLite+JSON<br>
							带*为必须填写。
						  </div>
						</div>	
						<br>
						
					<fieldset class="layui-field-title">
					  <legend class="layui-border-green">插件目录</legend>			
					</fieldset>	
						<div class="layui-panel layui-border-green" style="width: 80%; margin: 10px auto;">
						  <div style="padding: 16px;">
							您的插件必须存在main.py和__init__.py这两个文件，否则无法注册成功；<br>
							如果您的主要代码不想开源，可以部署到您的服务器，本地文件仅作调用处理。<br>
						  </div>
						</div>	
						<br>
						<div class="layui-form-item">
							<label class="layui-form-label"  style="width: 100px;">*插件目录名称</label>
							<div class="layui-input-block">
								<div class="layui-input-group">

									<input type="text" id="PlugDir" name="PlugDir" lay-verify="required" placeholder="plugins中的子文件夹名"  class="layui-input">
									<div class="layui-input-suffix">
										<button type="button" class="layui-btn" id="checkBtn">检测</button>
									</div>
								</div>
								<div id="ID-tree-demo-accordion"></div>
							</div>
						</div>

					<fieldset class="layui-field-title">
					  <legend class="layui-border-green">基本信息设置</legend>			
					</fieldset>	
						
						<div class="layui-panel layui-border-green" style="width: 80%; margin: 10px auto;">
						  <div style="padding: 16px;">
							从这里填写您的插件信息，注意：它不受任何保护，也不在互联网上使用。<br>
							需要注意的是：HTML主引导页和jinja2页面请分开放置于插件目录下的两个文件夹中：<br>
							HTML文件夹：您的插件目录/static/<br>
							jinja2文件夹：您的插件目录/templates/<br>
							注册程序会自动检测安装，您只需要在下面填写好HTML主引导页即可<br>
							*可以没有jinja2文件，但HTML页面至少一个。
						  </div>
						</div>	
						<br>
						<div class="layui-form-item">
							<label class="layui-form-label"  style="width: 100px;">*插件名称</label>
							<div class="layui-input-block">
								<div class="layui-input-group">
									<input type="text" name="PlugName" lay-verify="required" placeholder="不要输入符号或乱字符"  class="layui-input">
								</div>
							</div>
						</div>
							
						<div class="layui-form-item">
							<label class="layui-form-label"  style="width: 100px;">*插件版本号</label>
							<div class="layui-input-block">
								<div class="layui-input-group">
									<input type="text" name="Ver" lay-verify="required" placeholder="例如：1.0.1"  class="layui-input">
								</div>
							</div>
						</div>
							
						<div class="layui-form-item">
							<label class="layui-form-label"  style="width: 100px;">插件图标</label>
							<div class="layui-input-block">
								<div class="layui-input-group">
									<input type="text" id="ICO" name="ICO" placeholder="使用插件目录下的JPG/PNG文件" class="layui-input" style="width: 300px;">
								</div>
							</div>
						</div>
							
						<div class="layui-form-item">
							<label class="layui-form-label"  style="width: 100px;">*HTML主页</label>
							<div class="layui-input-block">
								<div class="layui-input-group">
									<input type="text" name="PlugHTML" lay-verify="required" placeholder="必须为HTML的文件名"  class="layui-input">
								</div>
							</div>
						</div>
							
						<div class="layui-form-item layui-form-text">
							<label class="layui-form-label"  style="width: 100px;">*插件描述</label>
							<div class="layui-input-block">
									<textarea placeholder="请输入内容" lay-verify="required" class="layui-textarea" style="width: 400px;" rows="10" name="PlugDes"></textarea>
							</div>
						</div>

						<div class="layui-form-item layui-form-text">
							<label class="layui-form-label"  style="width: 100px;">*版本说明</label>
							<div class="layui-input-block">
									<textarea placeholder="请输入内容" lay-verify="required"  class="layui-textarea" style="width: 400px;" rows="10" name="VerDes"></textarea>
							</div>
						</div>
						

						<div class="layui-form-item">
							<label class="layui-form-label"  style="width: 100px;">插件说明链接</label>
							<div class="layui-input-block">
								<div class="layui-input-group">
									<input type="text" name="help" placeholder="输入网址或文件相对地址：myplugin/***.html|doc等" class="layui-input" style="width: 400px;">
								</div>
							</div>
						</div>
						
						<div class="layui-form-item">
							<label class="layui-form-label"  style="width: 100px;">升级链接</label>
							<div class="layui-input-block">
								<div class="layui-input-group">
									<input type="text" name="uplink" placeholder="代码托管平台网址或自己的zip链接" class="layui-input" style="width: 400px;">
								</div>
							</div>
						</div>
							
						<div class="layui-form-item">
							<label class="layui-form-label"  style="width: 100px;">临时文件夹</label>
							<div class="layui-input-block">
								<div class="layui-input-group">
									<input type="text" name="uploadDir" placeholder="会自动生成的临时文件夹，用户可自行清理的部分" class="layui-input" style="width: 400px;">
									写入文件夹名，多个用英文逗号分割
								</div>
							</div>
						</div>

					<fieldset class="layui-field-title">
					  <legend class="layui-border-green">API信息</legend>			
					</fieldset>
						<div class="layui-panel layui-border-green" style="width: 80%; margin: 10px auto;">
						  <div style="padding: 16px;">
							如果您的插件不接受工作流部署，不必理会此项，若接受工作流部署，就必须了解其规则：<br>
							插件程序执行时以api.json的参数作为标准来执行；<br>
							api.json中的参数由您定义，因此这个接口说明是告知用户参数的作用，以便在工作流中编辑；<br>
							详细信息请查看《PlugLink开发者手册》；<br>
							您只需在下面填写您的接口说明即可。
						  </div>
						</div>	
						<br>
						<div class="layui-form-item layui-form-text">
							<label class="layui-form-label"  style="width: 100px;">API接口说明</label>
							<div class="layui-input-block">
									<textarea placeholder="请输入内容" class="layui-textarea" style="width: 400px;" rows="10" name="APIDes"></textarea>
							</div>
						</div>
							
					<fieldset class="layui-field-title">
					  <legend class="layui-border-green">开发者信息</legend>			
					</fieldset>
						<div class="layui-panel layui-border-green" style="width: 80%; margin: 10px auto;">
						  <div style="padding: 16px;">
							所有的插件注册信息将保存到插件根目录下的ThePlugin.json上，包括您的开发者信息。<br>

						  </div>
						</div>	
						<br>							
						<div class="layui-form-item">
							<label class="layui-form-label"  style="width: 100px;">作者</label>
							<div class="layui-input-block">
								<div class="layui-input-group">
									<input type="text" name="author" class="layui-input" style="width: 400px;">
								</div>
							</div>
						</div>

						<div class="layui-form-item">
							<label class="layui-form-label"  style="width: 100px;">公司名</label>
							<div class="layui-input-block">
								<div class="layui-input-group">
									<input type="text" name="comname" class="layui-input" style="width: 400px;">
								</div>
							</div>
						</div>
						
						<div class="layui-form-item">
							<label class="layui-form-label"  style="width: 100px;">公司网址</label>
							<div class="layui-input-block">
								<div class="layui-input-group">
									<input type="text" name="website" class="layui-input" style="width: 400px;">
								</div>
							</div>
						</div>
							
					  <div class="layui-form-item">
						<div class="layui-input-block button-container">
						  <button type="button" class="layui-btn" lay-submit lay-filter="add-submit" style="width: 200px;height: 50px;font-size: 20px;">注册插件</button>
						</div>
					  </div>
					</fieldset>	
						
					</div>
				</div>
			</form>
		</div>
	</div>
</div>
</div>
</body>
</html>


<script>//检测目录是否正确
layui.use(['jquery', 'layer', 'tree'], function(){
  var $ = layui.jquery,
      layer = layui.layer,
      tree = layui.tree;

  $('#checkBtn').on('click', function(){
    var plugDir = $('#PlugDir').val().trim();

    if (!plugDir) {
      layer.msg('请输入目录名');
      return;
    }

    $.ajax({
      type: "POST",
      url: "/reg_plugin",
      contentType: "application/json",
      data: JSON.stringify({ action: "plugin_dir", dirName: plugDir }),
      success: function(data) {
        if (!data || data.length === 0) {
          layer.msg('未找到指定的目录结构');
        } else {
          const hasMainPy = data.some(item => item.title === 'main.py');
          const hasInitPy = data.some(item => item.title === '__init__.py');
          //const hasMainExe = data.some(item => item.title === 'main.exe');
          const hasJsonFile = data.some(item =>item.title === 'ThePlugin.json');
          // 新增的检测逻辑
          const indexPage = data.find(item => item.title === 'static' && Array.isArray(item.children));
          const hasHtmlFile = indexPage ? indexPage.children.some(child => /\.html$/.test(child.title)) : false;
          
          let showMessage = true;

          if (hasMainPy && !hasInitPy) {
            layer.msg('存在main.py但缺少__init__.py文件，无法继续');
            showMessage = false;
          } else if (!hasMainPy && !hasMainExe) {
            layer.msg('缺少主文件，无法继续');
            showMessage = false;
          }
          
          if (hasJsonFile) {
            layer.msg('该插件已经被注册');
            showMessage = false;
          }

          if (!indexPage || !hasHtmlFile) {
            layer.msg('缺少HTML主文件');
            showMessage = false;
          }

          // 无论是否存在指定文件，都渲染树
          tree.render({
            elem: '#ID-tree-demo-accordion',
            data: data,
            accordion: true
          });

          // 如果没有触发任何错误消息，则显示成功提示
          if (showMessage) {
            layer.msg('目录检测成功，无错误文件', {icon: 1}); // icon: 1 为成功图标
          }
        }
      },
      error: function() {
        layer.msg('请求失败，请稍后再试');
      }
    });
  });
});
</script>
<script>
layui.use(['form', 'jquery', 'layer'], function(){
  var form = layui.form,
      $ = layui.jquery,
      layer = layui.layer;

  // 监听表单提交事件
  form.on('submit(add-submit)', function(data){
    var formData = {
      action: "add_myplugin", // 指定操作
      PlugDir: $('#PlugDir').val(),
      PlugName: $('input[name="PlugName"]').val(),
      Ver: $('input[name="Ver"]').val(),
      ICO: $('#ICO').val(),
      PlugHTML: $('input[name="PlugHTML"]').val(),
      PlugDes: $('textarea[name="PlugDes"]').val(),
      VerDes: $('textarea[name="VerDes"]').val(),
      APIDes: $('textarea[name="APIDes"]').val(), 
      author: $('input[name="author"]').val(),
      comname: $('input[name="comname"]').val(),
      website: $('input[name="website"]').val(),
      help: $('input[name="help"]').val(),
      uplink: $('input[name="uplink"]').val(),
      uploadDir: $('input[name="uploadDir"]').val(),
	  Keypass: '' // 添加了空值变量Keypass

    };

    // 使用Ajax发送数据
    $.ajax({
      type: "POST",
      url: "/reg_plugin", // 目标路由
      contentType: "application/json",
      data: JSON.stringify(formData),
      success: function(response) {
        // 请求成功时的回调
        layer.msg('提交成功', {icon: 1});
		window.location.href = 'reg_plugin.html'; 
      },
      error: function() {
        // 请求失败时的回调
        layer.msg('提交失败，请稍后再试', {icon: 2});
      }
    });

    return false; // 防止表单自动提交导致页面刷新
  });
});
</script>

